<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <link th:href="@{/erp/assets/css/bootstrap.min.css}" rel="stylesheet"/>
        <link rel="stylesheet" th:href="@{/erp/css/style.css}"/>
        <link rel="stylesheet" th:href="@{/erp/assets/css/ace.min.css}"/>
        <link rel="stylesheet" th:href="@{/erp/assets/css/font-awesome.min.css}"/>
        <link rel="stylesheet" href="/erp/Widget/zTree/css/zTreeStyle/zTreeStyle.css" type="text/css">
        <script th:src="@{/erp/assets/js/jquery.min.js}"></script>
        <script th:src="@{/erp/assets/js/bootstrap.min.js}"></script>
        <script th:src="@{/erp/assets/js/jquery.dataTables.min.js}"></script>
        <script th:src="@{/erp/assets/js/jquery.dataTables.bootstrap.js}"></script>
        <script th:src="@{/erp/assets/layer/layer.js}" type="text/javascript"></script>
        <script type="text/javascript" th:src="@{/erp/Widget/zTree/js/jquery.ztree.all-3.5.min.js}"></script>
        <script th:src="@{/erp/js/lrtk.js}" type="text/javascript"></script>
        <style>
            .imgg img {
                max-width: 100px
            }
        </style>
        <title>产品列表</title>
    </head>
    <body>
        <div class=" page-content clearfix">
            <div id="products_style">

                <!--产品列表展示-->
                <div class="h_products_list clearfix" id="products_list">
                    <div id="scrollsidebar" class="left_Treeview">
                        <div class="show_btn" id="rightArrow"><span></span></div>
                        <div class="widget-box side_content">
                            <div class="side_title"><a title="隐藏" class="close_btn"><span></span></a></div>
                            <div class="side_list">
                                <div class="widget-header header-color-green2"><h4 class="lighter smaller">商品列表</h4>
                                </div>
                                <div class="widget-body">
                                    <div class="widget-main padding-8">
                                        <div id="treeDemo" class="ztree"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="table_menu_list" id="testIframe">
                    </div>

                </div>
            </div>
        </div>
    </body>
</html>
<script>

    $(function () {
        $("#products_style").fix({
            float: 'left',
            //minStatue : true,
            skin: 'green',
            durationTime: false,
            spacingw: 30,//设置隐藏时的距离
            spacingh: 260,//设置显示时间距
        });
    });
</script>

<script type="text/javascript">

    $(document).ready(function () {
//初始化宽度、高度
        $(".widget-box").height($(window).height());
        $(".table_menu_list").width($(window).width() - 260);
        $(".table_menu_list").height($(window).height());
        //当文档窗口发生改变时 触发
        $(window).resize(function () {
            $(".widget-box").height($(window).height());
            $(".table_menu_list").width($(window).width() - 260);
            $(".table_menu_list").height($(window).height());
        })

        var setting = {
            async: {
                enable: true,
                url: '/procurement/sortTree'
            },
            view: {
                showLine: false,
                selectedMulti: false,
                showIcon: false
            },
            data: {
                key: {
                    name: "sortName",
                },
                simpleData: {
                    enable: true,
                    idKey: "id",
                    pIdKey: "pid",
                    rootPId: ''
                }
            },
            callback: {
                onClick: onClick,
                onAsyncSuccess :expendOneNode
            }
        }
        var t = $("#treeDemo");
        t = $.fn.zTree.init(t, setting);

       $('.table_menu_list').load("/procurement/order/right_listPage");
    });

    function onClick(event, treeId, treeNode, clickFlag) {
        $('.table_menu_list').load("/procurement/order/right_listPage?id=" + treeNode.id + "&sortType=" + treeNode.sortType);
    }
    function expendOneNode(event,treeId,treeNode){

        zTree = $.fn.zTree.getZTreeObj("treeDemo");
        var node = zTree.getNodes();
        //console.log(treeId);
        if(treeNode==null){
            //将根节点全部展开节点
            zTree.expandNode(node[0], true, false, false);//展开节点就会调用后台查询子节(异步)
        }
    }

</script>

